import React from "react";
import {Card,Table} from "antd";
export default class SimpleTable extends React.Component{
    componentWillMount() {
        const columns = [
            {
                title: '姓名',
                dataIndex: 'name',
                key: 'name',
            },
            {
                title: '年龄',
                dataIndex: 'age',
                key: 'age',
            },
            {
                title: '住址',
                dataIndex: 'address',
                key: 'address',
            },
        ];
        const dataSource = [
            {
                key: '1',
                name: '胡彦斌',
                age: 32,
                address: '西湖区湖底公园1号',
            },
            {
                key: '2',
                name: '胡彦祖',
                age: 42,
                address: '西湖区湖底公园1号',
            },
        ];
        this.setState({
            dataSource,
            columns
        })

    }

    render() {
        return(
            <div>
                <Card title="简单表格">
                    <Table
                        bordered
                        columns={this.state.columns}
                        dataSource={this.state.dataSource}
                    >
                    </Table>
                </Card>
                <Card title="动态渲染表格" style={{margin:"10px 0"}}>
                    <Table
                        bordered
                        columns={this.state.columns}
                        dataSource={this.state.dataSource2}
                    >
                    </Table>
                </Card>
            </div>
        )}
}